<template>
  <Menu :data="dada" :router="true" :collapse="collapse" class="el-menu-vertical-demo"></Menu>
</template>

<script lang="ts" setup>

let props = defineProps<{
  collapse: boolean
}>()

let dada = [
  {
    icon: 'Menu',
    name: '首页',
    index: '/'
  },
  {
    icon: 'Menu',
    name: '图标选择器',
    index: '/iconSelector'
  },
  {
    icon: 'Menu',
    name: '省市区选择器',
    index: '/areaSelector'
  },
  {
    icon: 'Menu',
    name: '趋势',
    index: '/trend'
  },
  {
    icon: 'Menu',
    name: '通知',
    index: '/notification'
  },
  {
    icon: 'Menu',
    name: '菜单',
    index: '/menu'
  },
  {
    icon: 'Menu',
    name: '进度条',
    index: '/progress'
  },
  {
    icon: 'Menu',
    name: '时间选择器',
    index: '/timeSelector'
  },
  {
    icon: 'Menu',
    name: '日期选择器',
    index: '/dateSelector'
  },
  {
    icon: 'Menu',
    name: '城市选择器',
    index: '/citySelector'
  },
  {
    icon: 'Menu',
    name: '表单',
    index: '/form'
  },
]
</script>

<style lang="scss" scoped>
.el-menu-vertical-demo:not(.el-menu--collapse) {
  width: 200px;
  min-height: 400px;
}


</style>